<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>订单</title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<meta http-equiv="expires" content="0">
		<meta http-equiv="pragma" content="no-cache">
		<meta http-equiv="cache-control" content="no-cache">
		<link href="../../../css/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet" href="../../../css/reset.css" />
		<link rel="stylesheet" href="../../../css/cmms.css" />
		<link rel="stylesheet" href="../../../css/iconfont.css" />
		<link rel="stylesheet" href="../../../css/mui.picker.min.css" />
		<link rel="stylesheet" href="../../../css/sale/order/order.css" />
		<link rel="stylesheet" href="../../../css/sale/replaceSingle/orders.css" />
		<script src="../../../js/vconsole.min.js"></script>
	</head>

	<body>
		<div id="order" v-cloak>
			<!--搜素-->
			<div class="topSearch">
				<input type="text" v-model="doctorName" :placeholder="icon"  />
				<button class="btn-primary right" @tap="searchItem" v-show="!isBtnShow">搜索</button>
				<span class="right" @tap="single" v-show="isBtnShow"><i class="iconfont icon-ludan"></i>录单</span>
			</div>
			<!--列表-->
			<div class="orderList" v-show="show">
				<ul class="orderListItem" v-for="list in orderList">
					<div class="detail" @tap="reportDetail(list.orderId)">
						<li class="row1">
						<span class="name">{{list.patientName}}</span>
						<span class="date">{{list.submitTime|replaceT}}</span>
						<span class="right basic-color">
							<i class="icon iconfont icon-shijian-"></i>
							{{list.orderState+""|formatState}}
						</span>
					</li>
					<li class="row2">
						检验条形码：<span>{{list.specimenBarCode.join(',')}}</span>
					</li>
					<li class="row3">
						<span>{{list.projectNmae.join(',')}}</span>
					</li>
					<li class="row4">
						<span>共<span class="basic-color">{{list.projectNum}}</span>个检验项目<span class="basic-color">¥{{list.amount}}</span></span>
						<span class="right">
							<i class="icon iconfont icon-icon1 basic-color"></i>
							{{list.doctorName}}
						</span>
					</li>
					</div>  
					<li class="row5" v-if='list.orderState==1'>
						<span class="btn-detail right cancelOrder"  @tap="del(list.orderId)">取消订单</span>
					</li>  
					<li class="row6">
						<p></p>
						<p>
							<span class="right saler">业务员:{{list.saleName}}</span>
							<span class="right creater" v-if="list.true==true">代录员:{{list.creatorName}}</span>
						</p>
					</li>
				</ul>
			</div>
			<!--未找到数据-->
			<div class="notFind" v-show="!show">
				<img src="../../../img/notFind.png" alt="未找到对应的数据" />
				<p>暂无数据</p>
			</div>
		</div>
	
		<script src="../../../js/mui.min.js"></script>
		<script src="../../../js/vue.js"></script>
		<script src="../../../js/mui.picker.min.js"></script>
		<script src="https://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
		<script src="../../../js/cmms.js?time=333"></script>
		<script type="text/javascript">
			mui.init()
		</script>
		<script type="text/javascript">
			new Vue({
				el:"#order",
				data:{
					selState:'全部',
					selStateNum:'',
					doctorName:'',
					orderList:[],//订单列表
					show:false,
					urlArr:[],//报告地址
					confirm:0,//是否确认订单
					isBtnShow:true,
					icon:'请输入诊所或医生 \ue604'
//					isTip:false
//					orderTip:0
				},
				watch:{
					doctorName:function(){
						if(this.doctorName!=''){
							this.isBtnShow = false;
						}else{
							this.isBtnShow = true;
						}
					}
				},
				mounted(){
//					var vConsole = new VConsole();
					this.init();
					this.getPages();
				},
				methods:{
					init(){
						let _this=this;
					},
//					onFocus(){
//						this.isBtnShow = false;
//					},
//					onBlur(){
//						this.isBtnShow = true;
//					},
					getPages(){
						/*获取页面*/
						let _this=this;
						
						//加载页面数据
						AT.muiAjax('/partner-sale/order/getTemporaryOrder','post',{
							name:_this.doctorName
						},function(res){
							_this.orderList=res;
							console.log(res);
							if(_this.orderList.length>0){
								_this.show=true;
							}else{
								_this.show=false;
							}
						});
					
					},
					single(){
						location.href="selectDoctor.html";
					},
					/*搜索*/
					searchItem(){
						this.getPages();
					},
					/*调用微信接口展示图片*/
					getImg(){
						let _this=this;
						wx.previewImage({
							current: _this.urlArr[0], // 当前显示图片的http链接
							urls: _this.urlArr// 需要预览的图片http链接列表
						});
					},
					/*状态选择*/
//					selectState:function(){
//						let _this = this;
//						var picker = new mui.PopPicker();
//						picker.setData([
//							{value:'',text:'全部'},
//							{value:'1',text:'未支付'},
//							{value:'5',text:'支付中'},
//							{value:'13',text:'已支付'},
//							{value:'9',text:'送检中'},
//							{value:'10',text:'检验中'},
//							{value:'11',text:'生成报告'},
//							{value:'12',text:'已取消'}
//						]);
//						picker.show(function (selectItems) {
//						    _this.selState=selectItems[0].text;
//						    _this.selStateNum=selectItems[0].value;
//						    _this.getPages();
//						})
//					},
					reportDetail(id){
						location.href = "orderDetail.html?id="+id;
					},
					/*取消订单*/
					del(id){
						console.log(id)
						let _this = this;
						mui.confirm("确定要取消这条订单么？",'取消订单',['再考虑一下','取消订单'],function(con){
							if(con.index===1){
								AT.muiAjax('/partner-sale/order/delTemporaryOrderStateById','post',{id:id},function(res){
									mui.toast(res)
									const timer = setTimeout(() =>{                    
										location.reload();              
									}, 1000);  
									_this.$once('hook:beforeDestroy', () => {            
									    clearTimeout(timer);                                    
									});
								})
							}
						})
					},
				}
			})
		</script>
	</body>

</html>